<template>
  <div class="marquee-box">
    <ul class="marquee-list">
      <li class="marquee-item scroll-right" v-if="index<=4" v-for="(item, index) in lists" :key="index">
        <div class="marquee-box-item" :class="{'future':scroll}">
          <div class="marquee-box-first">
            TOP{{item.index}}
          </div>
          <div class="marquee-box-second">{{item.companyName}}</div>
          <div class="marquee-box-third">{{item.value}}kw·h</div>
        </div>
      </li>
    </ul>
  </div>
</template>
<script>
// 将数组拆分成指定几个数组
const splitArray = (N, Q) => {
  let R = [],
    F
  for (F = 0; F < Q.length; ) R.push(Q.slice(F, (F += N)))
  return R
}
export default {
  props: {
    lists: {
      type: Array,
      default: () => []
    }
  },

  data() {
    return {
      scroll: false,
      currentIndex: 0
    }
  }
}
</script>
